<template>
	<view>
		<van-search v-model="value" placeholder="请输入搜索关键词" />
		<view class="con" v-for="(item,index) in menu" :key="index">
			<view class="title">{{item.type}}</view>
			<van-grid :column-num="3">
				<van-grid-item icon="photo-o" use-slot :text="item.name" v-for="(item1,index1) in item.list" :key="item1"  @click="routeTo(item1)">
				   <image
						 style="width:106rpx; height: 106rpx;"
						 :src="item1.icon"
					  />
				   <text class="name">{{ item1.name }}</text>
				</van-grid-item>
			</van-grid>
		</view> 
	</view>
</template>

<script setup>
	 import {ref,onMounted} from "vue"
	 const active = ref(0)
	  const props = defineProps({
	     menu:[], 
	   })
    onMounted(()=>{
		console.log(props.menu)
	})
	 const onChange =(e) =>{ 
		 active.value=e
	 }
	 const list=ref([
		 {name:'请假',path:"/pages/vacation/vacation"},
		 {name:'加班',path:"/pages/vacation/warkOvertime"},
		 {name:'出差',path:""},
	 ])
	 const list1=ref([
	 		 {name:'补卡',path:""}, 
	 ])
	 const list2=ref([
	 		 {name:'调入调出',path:"/pages/mobilize/index"},
	 		 {name:'晋升',path:"/pages/promotion/index"},
	 		 {name:'离职申请',path:""},
	 ])
	 const routeTo=(item)=>{
	  uni.navigateTo({
	     url:item.path,
	  })
	 }
</script>

<style lang="scss" scoped>
.con{
	width:700rpx;
	margin: 30rpx auto;
	background: #fff;
	.title{
		padding:15rpx;
		background: #fff;
		font-size: 28rpx;
		font-family: Source Han Sans, Source Han Sans;
		font-weight: 700;
		color: #3D3D3D; 
	}
}
</style>
